<template>
  <section class="mint-tabbar is-fixed">
    <a class="mint-tab-item" :class="selectNum === 1 ? 'is-selected':''">
      <div class="mint-tab-item-icon">
        <i class="atIcon atIcon-ganxi"></i>
      </div>
      <div class="mint-tab-item-label">
        洗衣
      </div>
    </a>
    <a class="mint-tab-item" :class="selectNum === 2 ? 'is-selected':''">
      <div class="mint-tab-item-icon">
        <i class="atIcon atIcon-form"></i>
      </div>
      <div class="mint-tab-item-label">
        订单
      </div>
    </a>
    <a class="mint-tab-item" :class="selectNum === 3 ? 'is-selected':''">
      <div class="mint-tab-item-icon">
        <i class="atIcon atIcon-gerenxinxi"></i>
      </div>
      <div class="mint-tab-item-label">
        我的
      </div>
    </a>
  </section>
</template>

<script>
  export default {
    props:{
      selectNum:{
        type:Number
      }
    },
    data () {
      return {
        msg: 'Welcome to Your Vue.js App'
      }
    }
  }
</script>

<style lang="less" scoped>
.mint-tab-item-icon{
  .atIcon{
    font-size: .95rem;
  }
}
</style>
